<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- 
Copyright (c) 2008 Matthew Johnson
Licensed under the MIT License (see license.txt)	
-->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Elements and Attributes</title>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>

<body>
	
<!-- {NAV} -->
<ul class="nav">
	<li>Markup
		<ul>
			<li><a href="getting_started.html">Getting started</a></li>
			<li><a href="attributes.html">Elements and attributes</a></li>
			<li><a href="actions.html">Events and actions</a></li>
			<li><a href="tweens.html">Tweens</a></li>
			<!--<li><a href="more_tweens.html">More tweens</a></li>-->
			<li><a href="custom_actions.html">Custom actions</a></li>
		</ul>
	</li>
	<li>Widgets
		<ul>
			<li><a href="buttons.html">Buttons</a></li>
			<li><a href="more_buttons.html">More buttons (and tabs)</a></li>
			<li><a href="filmstrip.html">Filmstrip</a></li>
			<li><a href="popup.html">Popup</a></li>
			<li><a href="drag_and_drop.html">Drag and drop</a></li>
			<li><a href="slider.html">Slider</a></li>
			<li><a href="scrollable_text.html">Scrollable text</a></li>
			<li><a href="media_controller.html">Media controller</a></li>
			<li><a href="video.html">Video</a></li>
		</ul>
	</li>
	<li>Example Media
		<ul>
			<li><a href="theories_and_assumptions/theories_and_assumptions.html">Tabs with drag and drop</a></li>
			<li><a href="group_counseling/group_counseling.html">Multiple videos with drag and drop</a></li>
		</ul>
	</li>
	<li><a href="cheatsheet.pdf">Cheatsheet</a></li>
	<li><a href="release_notes.html">Release Notes</a></li>
</ul>
<!-- {/NAV} -->
	
<h1>Elements and Attributes</h1>
	
<h2>Elements</h2> 
<p>
ActionML usually uses the name of an element to connect to an instance or a symbol from your fla file.  When it connects to a symbol a dynamic instance of that symbol is created.  The <a href="buttons.html">button</a> document contains examples of many different ways these connections are made.
</p>
<p>
Dynamic text instances can also be included in your xml.  They support all standard Flash attributes for text fields, but due to a Flash player limitation they do not support any ActionML or custom attributes.  However, you can include the text they should contain in the xml and it will be loaded into the dynamic text instance.  When doing this you can use the text attribute, the htmlText attribute, or you can simply include the text inside the xml element that connects to your dynamic text instance.  This text can even contain any html that Flash supports, thus allowing you to style the text.  If you do load the text dynamically be sure to embed the font.  If you are styling the text with html, you may need to include the normal font, the bold font, the italic font, and the bold italic font.  You can do this by entering some text in the instance on the stage and giving part of it each of these formats.  In this example we have entered abcd and given each letter a different format:
<br /><img src="attributes/dynamic_text.png" /><br />
</p>

<h2>Attributes</h2> 
<p>
Attributes provide values that change the way an instance looks or behaves.  They can be basic attributes that all Flash MovieClip instance have (such as x, y, rotation, alpha, etc).  ActionML also defines many of its own attributes.  Each ActionML widget defines the attributes it uses to change its appearance or behavior.  In addition to Flash attributes and ActionML attributes you can also define your own custom attributes.  These attributes can be used to provide values that are used when responding to events.
</p>
<p>
In our example we see two instances of the SampleSymbol.  The first instance exists on the stage in the fla file as you can see here:
<br /><img src="attributes/sample.png" /><br />
The second instance is defined in the ActionML xml file and is created dynamically.  In order to allow it to be created dynamically you must open the symbol properties in the library:
<br /><img src="attributes/properties.png" /><br />
and mark the symbol for export:
<br /><img src="attributes/export.png" /><br />
The first instance is rotated by supplying a rotation value in the ActionML xml file.  It is also given a custom attribute of right that is specified as equal to x + width.  The second instance is created in the ActionML xml file and placed using the x and y attributes.  It is given the name "aDynamicSample".  As you can see in the xml, not only can you provide a value directly for an attribute, you can also provide an expression that calculates the value by referring to other attributes and using simple mathematical calculations (+, -, *, /).
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','850','height','400','src','InteractionDemo','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','flashvars','example_swf=attributes/attributes.swf','movie','InteractionDemo' ); //end AC code
  </script>
  <noscript>
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="850" height="400">
    <param name="movie" value="InteractionDemo.swf" />
    <param name="quality" value="high" />

	<param name="FlashVars" value="example_swf=attributes/attributes.swf" />
    <embed src="InteractionDemo.swf" width="850" height="400" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" FlashVars="example_swf=attributes/attributes.swf"></embed>
  </object>
  </noscript>
Download the fla for this example <a href="attributes/attributes.fla">here</a>.
</p>

</body>
</html>
